import React from 'react';
import { InputNumber as AntdInputNumber } from 'antd';
import type { InputNumberProps as AntdInputNumberProps } from 'antd';
import { createStyles } from 'antd-style';

export interface InputNumberProps extends AntdInputNumberProps {
  /**
   * @description 自定义样式类名
   */
  customClassName?: string;
}

const useStyles = createStyles(({ token, css }) => ({
  inputNumber: css`
    border-radius: ${token.borderRadius}px;
    width: 100%;
  `,
}));

const InputNumberComponent = React.forwardRef<any, InputNumberProps>(({ customClassName, className, ...restProps }, ref) => {
  const { styles, cx } = useStyles();
  
  const inputNumberClassName = cx(
    className,
    customClassName,
    styles.inputNumber
  );

  return <AntdInputNumber ref={ref} className={inputNumberClassName} {...restProps as any} />;
});

const InputNumber = Object.assign(InputNumberComponent, {
  _InternalPanelDoNotUseOrYouWillBeFired: (AntdInputNumber as any)._InternalPanelDoNotUseOrYouWillBeFired,
});

export { InputNumber };
export default InputNumber;

